<style>
    .ui-main > .el-divider .el-divider__text {
        background: #F2F2F2;
    }

    .ui-main > h3 {
        padding-left: 20px;
        font-size: 20px;
        border-left: 2px solid #409EFF;
        margin-left: 10px;
    }
</style>
<template>
    <ly-page>
        <ly-navi type="title" title="表头/分页固定"></ly-navi>
        <ly-page-content>
            <ly-tip>
                <p>
                    通过指令<code>v-table-affix</code>可以将<code>el-table</code>和<code>ly-table</code> 进行表头和分页器固定
                </p>
                <p>当表头抵达顶部时会固定在顶部</p>
                <p>当表格长度超出屏幕,底部分页器会固定在底部</p>
            </ly-tip>
            <el-table v-table-affix :data="store.data" v-loading="store.loading">
                <el-table-column label="id" prop="id">
                </el-table-column>
                <el-table-column label="名称" prop="name">
                </el-table-column>
            </el-table>
            <ly-pagination :store="store"></ly-pagination>


            <ly-code-view>
             <pre v-pre>
 <el-table v-table-affix :data="store.data" v-loading="store.loading">

 </el-table>
             </pre>
            </ly-code-view>
            <ly-markdown>
                <pre v-pre>

## `v-table-affix`






                </pre>
            </ly-markdown>
        </ly-page-content>
    </ly-page>
</template>
<script>
    //这里定义组件
    Rap.define([], function () {
        return {
            data: function () {
                var store = Ly.dataStore({
                    data: function () {
                        var data = [];
                        for (var i = 0; i < 30; i++) {
                            data.push({id: i, name: 'name' + i})
                        }
                        return data;
                    }
                });
                store.load(1);
                return {
                    store: store

                }
            }, created: function () {

            }, init: function (query) {

            },
            methods: {}
        }
    })
</script>